
var mapArr = [
    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
    [-1, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 1],
    [1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 0, 1],
    [1, 0, 0, 0, 0, 1, 0, 1, 0, 1, 0, 1],
    [1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1],
    [1, 0, 1, 1, 0, 0, 0, 1, 0, 1, 0, 1],
    [1, 0, 1, 1, 1, 1, 1, 0, 0, 1, 0, 1],
    [1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
    [1, 0, 1, 0, 0, 0, 1, 0, 1, 1, 0, 1],
    [1, 0, 1, 1, 1, 0, 1, 0, 1, 0, 0, 1],
    [1, 0, 0, 0, 0, 1, 1, 0, 1, 0, 1, 1],
    [1, 0, 0, 0, 0, 0, 0, 0, 1, 0, 2, 1],
    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
];


function re_game() {
    mapArr = [
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
        [-1, 0, 0, 0, 0, 0, 0, 1, 0, 0, 0, 1],
        [1, 1, 1, 1, 1, 1, 0, 1, 0, 1, 0, 1],
        [1, 0, 0, 0, 0, 1, 0, 1, 0, 1, 0, 1],
        [1, 0, 1, 1, 0, 1, 0, 1, 0, 1, 0, 1],
        [1, 0, 1, 1, 0, 0, 0, 1, 0, 1, 0, 1],
        [1, 0, 1, 1, 1, 1, 1, 0, 0, 1, 0, 1],
        [1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 0, 1],
        [1, 0, 1, 0, 0, 0, 1, 0, 1, 1, 0, 1],
        [1, 0, 1, 1, 1, 0, 1, 0, 1, 0, 0, 1],
        [1, 0, 0, 0, 0, 1, 1, 0, 1, 0, 1, 1],
        [1, 0, 0, 0, 0, 0, 0, 0, 1, 0, 2, 1],
        [1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1],
    ]
    drawMap(mapArr);

}


function getHuman() {
    var pos = {
        x: 0,
        y: 0,
    }
    for (let x = 0; x < mapArr.length; x++) {
        for (let y = 0; y < mapArr[x].length; y++) {
            if (mapArr[x][y] == 2) {
                pos.x = x;
                pos.y = y;
            }
        }
    }
    return pos;
}

function drawMap() {
    for (let x = 0; x < mapArr.length; x++) {
        for (let y = 0; y < mapArr[x].length; y++) {
            var value = mapArr[x][y]
            if (value == 0) ctx.drawImage(block, y * dWidth - (block.width - dWidth) / 2, x * dHeight - (block.height - dHeight), block.width, block.height);
            if (value == 1) ctx.drawImage(box, y * dWidth - (box.width - dWidth) / 2, x * dHeight - (box.height - dHeight), box.width, box.height);
            if (value == -1) ctx.drawImage(wall, y * dWidth - (wall.width - dWidth) / 2, x * dHeight - (wall.height - dHeight), wall.width, wall.height);
            if (value == 2) {
                if (window.keyCode) {
                    if (window.keyCode == 87) {
                        ctx.drawImage(up, y * dWidth - (up.width - dWidth) / 2, x * dHeight - (up.height - dHeight), up.width, up.height);
                        continue
                    }
                    if (window.keyCode == 68) {
                        ctx.drawImage(right, y * dWidth - (right.width - dWidth) / 2, x * dHeight - (right.height - dHeight), right.width, right.height);
                        continue
                    }
                    if (window.keyCode == 83) {
                        ctx.drawImage(down, y * dWidth - (down.width - dWidth) / 2, x * dHeight - (down.height - dHeight), down.width, down.height);
                        continue
                    }
                    if (window.keyCode == 65) {
                        ctx.drawImage(left, y * dWidth - (left.width - dWidth) / 2, x * dHeight - (left.height - dHeight), left.width, left.height);
                        continue
                    }
                } else {
                    ctx.drawImage(down, y * dWidth - (down.width - dWidth) / 2, x * dHeight - (down.height - dHeight), down.width, down.height);
                }
            }
        }
    }

}

function event(value) {
    if (value == -1) {
        score.innerText = "you win! "
    }

}

function changePos(key) {
    let pos = getHuman(mapArr);
    var x = pos.x;
    var y = pos.y;
    if (key == "up") {
        if (mapArr[x - 1][y] != 1) {
            event(mapArr[x - 1][y]);
            mapArr[x][y] = 0;
            mapArr[x - 1][y] = 2;
        } else {
            tip.innerText = "up is wall!"
        }
    }
    if (key == "down") {
        if (mapArr[x + 1][y] != 1) {
            event(mapArr[x + 1][y]);
            mapArr[x][y] = 0;
            mapArr[x + 1][y] = 2;
        } else {
            tip.innerText = "down is wall!"
        }
    }
    if (key == "right") {
        if (mapArr[x][y + 1] != 1) {
            event(mapArr[x][y + 1]);
            mapArr[x][y] = 0;
            mapArr[x][y + 1] = 2;
        } else {
            tip.innerText = "right is wall!"
        }
    }
    if (key == "left") {
        if (mapArr[x][y - 1] != 1) {
            event(mapArr[x][y - 1]);
            mapArr[x][y] = 0;
            mapArr[x][y - 1] = 2;
        } else {
            tip.innerText = "left is wall!"
        }

    }
    drawMap();


}



document.onkeydown = function curManUp(event) {
    var keyCode = event.keyCode;
    window.keyCode = keyCode;
    tip.innerText = "no message";
    switch (keyCode) {
        case 87:
            changePos('up');
            break;
        case 68:
            changePos('right');
            break;
        case 83:
            changePos('down');
            break;
        case 65:
            changePos('left');
            break;
    }
};